import { Component, Prop } from 'vue-facing-decorator'
import Render from '@/render/Render'
import toNative from '@/utils/toNative'
import RenderDescription, {
    type DescItemDto
} from '@/components/render-descriotion/Index'
import BasicDataSupplementPop from './BasicDataSupplementPop'
import type { InsureEnsurePlanListDto } from '@/api/insureEnsurePlan/types'
import { InsureEnsureStatusCnEnum, InsurePlanTypeCnEnum, InsureTypeCnEnum, OccupationLevelCnEnum, ValidRuleTypeCnEnum } from '@/const/enum'
@Component
export class BasicInfoView extends Render {
    @Prop() detailData!: InsureEnsurePlanListDto
    
    isBasicEditPop = false
    
    get schemeInfoData() {
        return [
            {
                label: '方案简称',
                value: this.detailData.planName
            },
            {
                label: '有效时间',
                slot: () => {
                    return <div>
                        {this.detailData.planStartTime} ~ {this.detailData.planEndTime}
                    </div>
                }
            },
            {
                label: '风险等级',
                value: this.detailData.dangerLevel?.map(i => {
                    return OccupationLevelCnEnum[i]
                })?.join('，'),
            },
            {
                label: '保司名称',
                value: this.detailData.name,
            },
            {
                label: '方案类型',
                value: InsurePlanTypeCnEnum[this.detailData.insurePlanType],
            },
            {
                label: '生效方式',
                value: ValidRuleTypeCnEnum[this.detailData.effectType],
            },
            {
                label: '保险产品',
                value: InsureTypeCnEnum[this.detailData.insureType],
            },
            {
                label: '资料补充',
                value: this.detailData.specialRemark,
            }
        ] as DescItemDto[]
    }
	
    get systemInfoData() { 
        return [
            {
                label: '方案ID',
                value: this.detailData.id
            },
            {
                label: '状态',
                value: InsureEnsureStatusCnEnum[this.detailData.status]
            },
            {
                label: '创建人',
                value: this.detailData.createUserName
            },
            {
                label: '创建时间',
                value: this.detailData.createTime
            },
            {
                label: '最新更新人',
                value: this.detailData.updateUserName
            },
            {
                label: '最新更新时间',
                value: this.detailData.updateTime
            },
            {
                label: '保司方案',
                value: this.detailData.planName
            },
        ]
    }
    render() {
        return <div class="">
            <div class="py-20">
                <div class="text-black-200 text-lg font-semibold">方案信息</div>
                <div class="mt-20">
                    <RenderDescription renderData={this.schemeInfoData}/>
                </div>
            </div>
            <div class="py-20">
                <div class="text-black-200 text-lg font-semibold">系统信息</div>
                <div class="mt-20">
                    <RenderDescription renderData={this.systemInfoData}/>
                </div>
            </div>
			
            <BasicDataSupplementPop
                v-model:show={this.isBasicEditPop}
            />
        </div>
    }
}

export default toNative<{detailData: InsureEnsurePlanListDto}, {}>(BasicInfoView)